<script language="javascript">
<!--
Ext.get('box1').on('click',function(e){
	Ext.getCmp('forum-tree').expand();
	Ext.getCmp('board-buddy').expand();
	Ext.getCmp('main-viewport').doLayout();
});
Ext.get('box2').on('click',function(e){
	Ext.getCmp('forum-tree').collapse();
	Ext.getCmp('board-buddy').expand();
	Ext.getCmp('main-viewport').doLayout();
});
Ext.get('box3').on('click',function(e){
	Ext.getCmp('forum-tree').expand();
	Ext.getCmp('board-buddy').collapse();
	Ext.getCmp('main-viewport').doLayout();
});
Ext.get('box4').on('click',function(e){
	Ext.getCmp('forum-tree').collapse();
	Ext.getCmp('board-buddy').collapse();
	Ext.getCmp('main-viewport').doLayout();
});
//-->
</script>
<div style="float: left;height: 160px;width: 100%;">
	<div style="margin:20px 50px;">
		<div style="float: left;height: 40px;width: 86px;margin:5px;cursor:pointer;" id="box1">
			<div style="float:left;width: 10px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 40px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 10px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
		</div>
		<div style="float: left;height: 40px;width: 86px;margin:5px;cursor:pointer;" id="box2">
			<div style="float:left;width: 0;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 50px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 10px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
		</div>
	</div>
	<div style="clear:both;"></div>
	<div style="margin:20px 50px;">
		<div style="float: left;height: 40px;width: 86px;margin:5px;cursor:pointer;" id="box3">
			<div style="float:left;width: 10px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 50px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 0;border:solid 1px #ccc;height:38px;text-align:center;"></div>
		</div>
		<div style="float: left;height: 40px;width: 86px;margin:5px;cursor:pointer;" id="box4">
			<div style="float:left;width: 0;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 60px;border:solid 1px #ccc;height:38px;text-align:center;"></div>
			<div style="float:left;width: 0;border:solid 1px #ccc;height:38px;text-align:center;"></div>
		</div>
	</div>
</div>